import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)

// 初始化静态路由
const staticRoutes = [
  {
    path: '/', // 根路径
    redirect: '/login' // 重定向到登录页面
  },
  {
    path: '/login', // 登录页面路径
    component: () => import(/* webpackChunkName: "Login-Home-Welcom" */ '@pages/Login') // 动态加载登录页面组件
  },
  {
    path: '/welcome', // 欢迎页面路径
    component: () => import(/* webpackChunkName: "Login-Home-Welcom" */ '@src/Layout'), // 动态加载布局组件
    redirect: '/home', // 重定向到主页
    children: [
      {
        path: '/home', // 主页路径
        name: '首页',
        component: () => import(/* webpackChunkName: "Login-Home-Welcom" */ '@pages/Home') // 动态加载主页组件
      },
      {
        path: '/commodity', // 商品管理路径
        name: '商品管理',
        component: () => import(/* webpackChunkName: "Login-Home-Welcom" */ '@pages/Commodity') // 动态加载商品管理组件
      },
      {
        path: '/user', // 用户管理路径
        name: '用户管理',
        component: () => import(/* webpackChunkName: "Login-Home-Welcom" */ '@pages/User') // 动态加载用户管理组件
      },
      {
        path: '/other', // 其他页面路径
        component: () => import(/* webpackChunkName: "Login-Home-Welcom" */ '@pages/Other'), // 动态加载页面一组件
        children: [
          {
            path: '/page_one', // 页面一路径
            name: '页面一',
            component: () => import(/* webpackChunkName: "Login-Home-Welcom" */ '@pages/Other/page_one') // 动态加载页面一组件
          },
          {
            path: '/page_two', // 页面二路径
            name: '页面二',
            component: () => import(/* webpackChunkName: "Login-Home-Welcom" */ '@pages/Other/page_two') // 动态加载页面二组件
          }
        ]
      }
    ]
  }
]

// 从 sessionStorage 中获取后台接口返回的路由数据
const backendRoutes = JSON.parse(sessionStorage.getItem('menu')) ? JSON.parse(sessionStorage.getItem('menu')) : staticRoutes

// 生成动态路由的函数
function generateRoutes(routesData) {
  // 检查 routesData 是否为有效数组
  if (!routesData || !Array.isArray(routesData)) {
    return [] // 如果无效，返回空数组
  }

  return routesData.map(route => {
    // 增加对 url 属性的空值检查
    const componentPath = route.url ? route.url.split('/').map(part => part.charAt(0).toUpperCase() + part.slice(1)).join('') : ''
    // 将 url 路径转换为组件路径
    const component = componentPath ? () => import(`@pages/${componentPath}`) : null

    const dynamicRoute = {
      path: route.path, // 路由路径
      component, // 动态加载的组件
      name: route.label,
      meta: {
        label: route.label, // 路由标签
        icon: route.icon // 路由图标
      }
    }

    if (route.children) {
      dynamicRoute.children = generateRoutes(route.children) // 递归生成子路由
    }

    return dynamicRoute
  })
}

// 创建路由器实例
const router = new VueRouter({
  routes: staticRoutes // 使用静态路由初始化路由器
})

// 动态添加路由
let hasAddedDynamicRoutes = false // 标志变量，记录是否已经添加过动态路由

function addDynamicRoutes() {
  if (hasAddedDynamicRoutes) return // 如果已经添加过动态路由，直接返回

  const welcomeRoute = staticRoutes.find(route => route.path === '/welcome') // 找到欢迎页面的路由
  if (welcomeRoute && backendRoutes) {
    welcomeRoute.children = generateRoutes(backendRoutes) // 生成动态路由并添加到欢迎页面的子路由中
  }

  router.addRoutes(staticRoutes) // 添加所有静态路由
  hasAddedDynamicRoutes = true // 设置标志变量
}

// 在 beforeEach 钩子中调用动态路由生成函数
router.beforeEach((to, from, next) => {
  if (to.path === from.path) {
    // 忽略重复的导航
    return
  }

  if (to.path === '/login') {
    // 检查用户是否已登录
    const tokenStr = window.sessionStorage.getItem('Token') // 从 sessionStorage 中获取 token
    if (tokenStr) {
      // 用户已登录，重定向到主页
      return next({ path: '/home' })
    } else {
      // 用户未登录，允许访问登录页面
      return next()
    }
  }

  // 从 sessionStorage 中获取 token
  const tokenStr = window.sessionStorage.getItem('Token')
  // 没有 token 强制跳到登录页
  if (!tokenStr) return next('/login')

  // 如果是第一次访问，动态添加路由
  if (!hasAddedDynamicRoutes) {
    addDynamicRoutes() // 调用动态添加路由函数
  }

  next() // 继续导航
})

// 重写 push 方法以处理重复导航错误
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => {
    if (err.name !== 'NavigationDuplicated') {
      throw err // 如果不是重复导航错误，则抛出异常
    }
  })
}

export default router // 导出路由器实例
